<template>
  <view class="normal-login-container">
      <video id="rez_video" :src="videoUrl"
			 ref="rez_video"
             v-if="show_video"
             :autoplay="true"
             @ended="show_video = false"
             :controls="false"
             :muted="true"
             :show-progress="false"
             :show-fullscreen-btn="false"
             :show-play-btn="false"
             :show-center-play-btn="false"
             :enable-progress-gesture="false"
             object-fit="fill"></video>
      <view class="logo-content align-center justify-center flex">
          <!-- <image style="width: 100rpx;height: 100rpx;" :src="globalConfig.appInfo.logo" mode="widthFix">
          </image> -->
      </view>
      <view class="login-form-content">
          <view class="input-item flex align-center">
              <view class="iconfont icon-user icon"></view>
              <input v-model="loginForm.userName" class="input" type="text" placeholder="请输入账号" maxlength="30"/>
          </view>
      <view class="input-item flex align-center">
        <view class="iconfont icon-password icon"></view>
        <input v-model="loginForm.password" :type="showPsw ? 'text' : 'password'" class="input" placeholder="请输入密码" maxlength="20" />
        <!-- <view class="iconfont icon-password icon"></view> -->
        <u-icon :name="showPsw ? 'eye-fill' : 'eye-off'" @click="showPsw = !showPsw" style="margin-right: 10px"></u-icon>
      </view>
      <view style="text-align: right; color: #0081ff"><text @click="forgetPassword()">忘记密码</text></view>
      <!--    <view class="input-item flex align-center" style="width: 60%;margin: 0px;" v-if="captchaEnabled">
        <view class="iconfont icon-code icon"></view>
        <input v-model="loginForm.code" type="number" class="input" placeholder="请输入验证码" maxlength="4" />
        <view class="login-code"> 
          <image :src="codeUrl" @click="getCode" class="login-code-img"></image>
        </view>
      </view> -->
      <view class="action-btn">
        <button @click="handleLogin" class="login-btn cu-btn block bg-blue lg">登录</button>
      </view>
      <view class="reg text-center" v-if="register">
        <!-- <text class="text-grey1">没有账号？</text> -->
        <text @click="handleUserRegister" class="text-blue">用户注册</text>
      </view>
      <!-- <view class="xieyi text-center">
        <text class="text-grey1">登录即代表同意</text>
        <text @click="handleUserAgrement" class="text-blue">《用户协议》</text>
        <text @click="handlePrivacy" class="text-blue">《隐私协议》</text>
      </view> -->

      <u-overlay :show="show" @click="show = false">
        <view class="warp">
          <view class="rect" @click.stop>
			  <view>
			  	请联系管理员重置密码
			  </view>
			  <text>
			  	联系方式：{{ email }}
			  </text>
		  </view>
        </view>
      </u-overlay>
    </view>
  </view>
</template>

<script>
// import { getCodeImg } from '@/api/login'
import { getToken, setToken } from "@/utils/auth";
import { aesEncrypt } from "@/utils/crypto";

export default {
  data() {
    return {
        videoUrl: null,
        show_video: true,
        show: false,
        showPsw: false,
        codeUrl: '',
        captchaEnabled: true,
        // 用户注册开关
        register: true,
        globalConfig: getApp().globalData.config,
        loginForm: {
            userName: '',
            password: ''
            // code: "",
            // uuid: ''
        },
		email: ''
    };
  },
    mounted() {
		const systemInfo = uni.getSystemInfoSync();
		console.log("看看这个类型",systemInfo)
		// if (systemInfo.uniPlatform === 'h5') {
			    this.videoUrl = require('../static/video/111.mp4')
		// }else{
		// 	this.videoUrl = require('../static/video/ryz.mp4')
		// }
        this.getEmail()
    
    },
    methods: {
        // 用户注册
        handleUserRegister() {
            this.$tab.redirectTo(`/pages/register`)
        },
        // 隐私协议
        handlePrivacy() {
            let site = this.globalConfig.appInfo.agreements[0]
            this.$tab.navigateTo(`/pages/common/webview/index?title=${site.title}&url=${site.url}`)
        },
    // 用户协议
    handleUserAgrement() {
      let site = this.globalConfig.appInfo.agreements[1];
      this.$tab.navigateTo(`/pages/common/webview/index?title=${site.title}&url=${site.url}`);
    },
    // 获取图形验证码
    // getCode() {
    //   getCodeImg().then(res => {
    //     this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled
    //     if (this.captchaEnabled) {
    //       this.codeUrl = 'data:image/gif;base64,' + res.img
    //       this.loginForm.uuid = res.uuid
    //     }
    //   })
    // },
    // 登录方法
    async handleLogin() {
      if (this.loginForm.userName === "") {
        this.$modal.msgError("请输入您的账号");
      } else if (this.loginForm.password === "") {
        this.$modal.msgError("请输入您的密码");
      }
      // else if (this.loginForm.code === "" && this.captchaEnabled) {
      //        this.$modal.msgError("请输入验证码")
      //      }
      else {
        this.$modal.loading("登录中，请耐心等待...");
        this.pwdLogin();
      }
    },
    // 密码登录
    async pwdLogin() {
      // this.$store.dispatch('Login', this.loginForm)
      // 使用AES加密密码
      const newPwd = aesEncrypt(this.loginForm.password);
      this.$request({
        url: "/login/login",
        method: "post",
        data:{
          userName:this.loginForm.userName,
          password:newPwd
        }
      })
        .then(({ data }) => {
          this.$modal.closeLoading();
          this.loginSuccess(data);
        })
        .catch(() => {});
    },
    // 登录成功后，处理函数
    loginSuccess(result) {
      console.log(result, "ffff");
      uni.setStorageSync("user", result);
      setToken(result.token);
      this.$store.commit("SET_TOKEN", result.token);
      this.$store.commit('SET_NAME', result.userName)
      this.$store.commit('SET_NICK_NAME', result.nickName)
        this.$store.commit('SET_ID', result.id)
      // 设置用户信息
      // this.$store.dispatch('GetInfo').then(res => {
      this.$tab.reLaunch("/pages/index");
      this.fileTypeListFn();
      this.majorTypeListFn();
      this.menuList();
      // })
    },
    menuList() {
      this.$request({
        url: "/menu/userMenu",
        method: "GET",
      }).then(({ data }) => {
        console.log(data, "菜单");
        data.h5.map((item) => {
          if (item.menuName == "知识问答" && item.visible == false) {
            uni.setTabBarItem({
              index: 1,
              visible: false,
            });
          }
		  if (item.menuName == "线上培训" && item.visible == false) {
            uni.setTabBarItem({
              index: 1,
              visible: false,
            });
          }
		  if (item.menuName == "文件管理" && item.visible == false) {
            uni.setTabBarItem({
              index: 1,
              visible: false,
            });
          }
        });
      });
    },

    majorTypeListFn() {
      this.$request({
        url: "/dict/major/list",
        method: "GET",
        params: {},
      }).then(({ data }) => {
        uni.setStorageSync("majorType", data.data);
      });
    },
    //文件字典
    fileTypeListFn() {
      this.$request({
        url: "/dict/file/list",
        method: "get",
        params: {},
      }).then(({ data }) => {
        uni.setStorageSync("fileType", data.data);
      });
    },
    getEmail() {
      this.$request({
        url: "/dict/email",
        method: "get",
      }).then(({ data }) => {
        this.email = data
      });
    },
    forgetPassword() {
      if (!this.loginForm.userName) {
        this.$toast('请输入您的账号')
        return
      }
      this.show = true
      this.$request({
        url: "/user/forgetPassword",
        method: "get",
        params: {
          userAccount: this.loginForm.userName
        }
      }).then(({ data }) => {
        console.log(data)
      });
    },
  },
};
</script>

<style lang="scss" scoped>
::v-deep uni-video {
    height: 100%;
}

.input {
    outline: none;
    border: none;
    background: transparent;
}
.warp {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  .rect {
    padding: 20px 40px;
    color: red;
    background-color: #fff;
  }
}
.normal-login-container {
    width: 100%;
    height: 100%;
    position: fixed;
    background-image: url("../static/images/login_bg1.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-color: #e5eff7;
    
    #rez_video {
        width: 100%;
        height: 100%;
    }
    
    .logo-content {
        width: 100%;
        font-size: 21px;
        text-align: center;
        padding-top: 22%;
        
        image {
            border-radius: 4px;
        }

    .title {
      margin-left: 10px;
      font-weight: 600;
      font-size: 30px;
    }
  }

  .login-form-content {
    text-align: center;
    margin: 70% auto 0;
    // margin-top: 15%;
    width: 80%;

    .input-item {
      margin: 20px auto;
      background-color: #f5f6f7;
      height: 45px;
      border-radius: 10px;

      .icon {
        font-size: 38rpx;
        margin-left: 10px;
        color: #999;
      }

      .input {
        width: 100%;
        font-size: 14px;
        line-height: 20px;
        text-align: left;
        padding-left: 15px;
      }
    }

    .login-btn {
      margin-top: 20px;
      height: 45px;
    }

    .reg {
      margin-top: 15px;
    }

    .xieyi {
      color: #333;
      margin-top: 20px;
    }

    .login-code {
      height: 38px;
      float: right;

      .login-code-img {
        height: 38px;
        position: absolute;
        margin-left: 10px;
        width: 200rpx;
      }
    }
  }
}
</style>
